<!-- 超时销假 -->
<template>
	<view class="leave_body" style="padding-bottom:60rpx;">
		<view class="leaveapply_box">
			<view class="leave_title">
				请假人基本信息
			</view>
			<view class="leave_row">
				<span class='leave_row_left'>学生姓名</span>
				<span class='leave_row_right'>{{username}}</span>
			</view>
			<view class="leave_row">
				<span class='leave_row_left'>学生学号</span>
				<span class='leave_row_right'>{{id}}</span>
			</view>
			<view class="leave_row">
				<span class='leave_row_left'>学生班级</span>
				<span class='leave_row_right'>{{class_name}}</span>
			</view>
		</view>
		<view class="leaveapply_box">
			<view class="leave_title">
				请假时间
			</view>
			<view class="leave_row">
				<span class='leave_row_left'>开始时间</span>
				<span class='leave_row_right'>{{begintime}}</span>
			</view>
			<view class="leave_row">
				<span class='leave_row_left'>结束时间</span>
				<span class='leave_row_right'>{{endtime}}</span>
			</view>
			<view class="leave_row">
				<span class='leave_row_left'>总时长</span>
				<span class='leave_row_right'>{{hours}} 小时</span>
			</view>
		</view>
		<view class="leaveapply_box2">
			<view class="leave_title">
				请假详情
			</view>
				<textarea disabled='true' :value="reason"></textarea>
		</view>
		<view class="leaveapply_box2">
			<view class="leave_title">
				外出路线描述
			</view>
			<textarea disabled='true' :value="description"></textarea>
		</view>
		<view class="leaveapply_box2" v-if="imgpath!=''">
			<view class="leave_title">
				图片
			</view>
			<image :src="imgpath" mode="widthFix" v-if="imgpath!=''"></image>
		</view>
		<view class="leaveapply_box2">
			<view class="leave_title">
				请假审批
			</view>
			<view class="zhengwen1">
				<text class="approve_name" v-if="fdy!=''">{{fdy}}已经批准</text>
				<!-- <text class="approve_name" v-if="sj!=''">{{sj}}已经批准</text> -->
			</view>
			<button class="button_submit" @click="submit">确认销假</button>
		</view>
			<!-- <button style="margin: 10rpx 0rpx;" @click="submit" type="default">确认销假</button> -->
			
	</view>
</template>

<script>
	export default {
		data() {
			return {	
				id: '',
				name:'',
				username: '',
				class_name: '计算机应用2班',
				begintime: '2022-6-9',
				endtime: '2022-6-9',
				hours: '4',
				invitation:'',
				overtime:'',
				reason:'',
				revokes:'',
				description: '', //外出路线
				imgpath: '',
				imgshow: false,
				srcArr:[],
				fdy:'', //辅导员
			}
		},
		methods: {
	
			open() {
				this.imgshow = true;
			},
			close() {
				this.imgshow = false;
			},
			chooseimage() {
				uni.chooseImage({
					count: 6,
					sizeType: ['original', 'compressed'],
					sourceType: ['album'],
					success: (res) => {
						
					}
				});
			},
			submit(){

				uni.request({
					url:this.baseUrl+ "/leave/updateLapseLeave?satoken="+uni.getStorageSync('satoken'),
					method:'POST',
					data: {
					"leave_id": this.invitation,
					"overrevokes": "xxx", //这一版本，暂没有处理超时销假,超时销假原因，统一为xxx
					"revokes": this.revokes, 
					"address":"河南省信阳市息县"
					},
					withCredentials:true,
					headers: {
					// "token": localStorage.getItem("token")
					 },
					success:(res) => {
						
					 setTimeout(() => {
					 	  uni.showToast({
					 		icon:"success",
					 		title: ' 销假成功 ',
					 	  });
					 	  setTimeout(() => {
							// this.$router.push({path:'/pages/TabBar/inquire/inquire'});
								uni.reLaunch({
									url: '/pages/TabBar/inquire/inquire',
								});	
					 	  }, 1000)
					 	}, 0); 
					}
				});
				
			},  
			/* getQueryVariable(variable) {
			var query = this.paraString;
			var rooms = query.split('?');
			for (var i = 0; i < rooms.length; i++) {
				var pair = rooms[i].split('=');
				if (pair[0] == variable) {
					return (pair[1].split('&'))[0]
				}
			}
			//或者拼接&后面的值
			var vars = query.split('&')
			for (var i = 0; i < vars.length; i++) {
				var pair = vars[i].split('=')
				if (pair[0] == variable) {
					return pair[1]
				}
			}
		}, */

		},
		onLoad(options) {
			let that=this;
			// that.paraString = window.location.href;   //还可以  window.location.search.substring()
			// that.invitation = that.getQueryVariable('leave_id'); //leave_id是url后面带的
			this.invitation = options.leave_id
			uni.request({
				url:this.baseUrl+ "/leave/searchLeaveDetail?satoken="+uni.getStorageSync('satoken'),
				method:'POST',
				data: {
				// "leave_id": that.invitation	
					leave_id:options.leave_id
				},
				withCredentials:true,
				headers: {
				// "token": localStorage.getItem("token")
				 },
				success:(res) => {
					console.info(res);
					this.username=res.data.result.username;
					this.class_name=res.data.result.class_name;
					 that.id=res.data.result.sno;
					 this.begintime=res.data.result.begintime;
					 this.endtime=res.data.result.endtime;	
					 this.hours=res.data.result.hours;
					 this.description=res.data.result.description;
					 this.fdy=res.data.result.fdy;
					 if(res.data.result.imgpath)
					 	this.imgpath = this.baseUrl + "/upload/" +res.data.result.imgpath
					 // this.imgpath=res.data.result.imgpath;
					 that.reason=res.data.result.reason;
				
				}
			});
			
			
			
		},
		components: {
			// imgHD
		}
	}
</script>

<style lang="scss">
	@import url(@/common/common.css);

	.leave-info-box {
		width: 95%;
		margin: 0 auto;
		box-sizing: border-box;
		position: relative;

		.leave-info-content {
			width: 100%;
			box-sizing: border-box;
			display: flex;
			flex-direction: column;
			padding-top: 20rpx;
			padding-bottom: 20rpx;

			.m_top {
				margin-top: 10rpx;
			}

			.leave-info-name {
				width: 100%;
				box-sizing: border-box;
				margin-bottom: 20rpx;
				justify-content: center;
			}

			.leave-info-classnumber {
				width: 100%;
				box-sizing: border-box;
				display: flex;
				flex-direction: row;

				.class-number {
					flex: 1;

				}

				.class-name {
					flex: 2;

				}
			}

			.time-title {
				margin-top: 40rpx;
				margin-bottom: 20rpx;
			}

			.leave-info-time {
				display: flex;
				width: 100%;
				box-sizing: border-box;
				flex-direction: row;
				border: 1rpx solid #999999;
				padding: 20rpx;

				.leave-info-left-time {
					flex: 1;

					text {
						letter-spacing: 1rpx;
						line-height: 40rpx;
					}

					.start-date {
						margin-right: 20rpx;
					}

				}

				.leave-info-right-time {
					flex: 1;

					text {
						letter-spacing: 1rpx;
						line-height: 40rpx;
					}

					.end-date {
						margin-right: 20rpx;
					}
				}

			}

			.num-time {
				margin-top: 20rpx;

				.color {
					color: rgb(202, 17, 17);
				}
			}

			.leave-explain-title {
				margin-top: 40rpx;
				margin-bottom: 20rpx;
			}

			.leave-explain-content {
				width: 100%;
				box-sizing: border-box;
				border: 1rpx solid #999999;
				padding: 20rpx;
			}

			.leave-course-title {
				margin-top: 40rpx;
				margin-bottom: 20rpx;
			}

			.leave-course-content {
				width: 100%;
				box-sizing: border-box;
				border: 1rpx solid #999999;
				padding: 20rpx;
			}

			.leave-img-title {
				margin-top: 40rpx;
				margin-bottom: 20rpx;
			}

			.leave-img {
				display: flex;
				width: 100%;
				box-sizing: border-box;
				flex-direction: row;
				padding: 10rpx;
				overflow: hidden;

				.imgbox {
					flex: 1;

					image {
						width: 150rpx;
						height: 150rpx;
					}
				}
			}

			.teacher {
				width: 100%;
				box-sizing: border-box;
				margin-top: 40rpx;

				textarea {
					box-sizing: border-box;
					width: 100%;
					height: 200rpx;
					border: 1rpx solid #999999;
					padding: 20rpx;
				}
			}

			.yes {
				width: 600rpx;
				height: 80rpx;
				border: #999999 solid 1rpx;
				margin: 0 auto;
				margin-top: 80rpx;
				line-height: 80rpx;
				text-align: center;
				color: #cb1111;
				margin-bottom: 80rpx;
			}



		}

		.shadebox {
			width: 100%;
			height: 100%;
			position: fixed;
			top: 0;
			left: 0;
			box-sizing: border-box;
			background: rgba(0, 0, 0, 0.6);
			padding-top: 50%;

			.shadecontentbox {
				width: 100%;
				height: 100%;
				position: absolute;
				display: flex;

				.imgHD {
					width: 100%;
					// margin-top: -25%;
					display: flex;
					justify-content: center;
				}
			}
		}

		.pad_be {
			padding: 0 20rpx;
		}

		// }

	}
</style>
